<template>
  <jy-dialog :title="title" :visible.sync="open" width="610px" append-to-body>
    <ul>
      <li v-for="(item, index) in tableList" :key="index" @click="setCharacter(item)">{{ item }}</li>
    </ul>
  </jy-dialog>
</template>
<script>
import store from "@/store";
import Bus from "@/utils/bus";
export default {
  name: 'SpecialCharacterView',
  props: {
    activeValue: {
      type: [String, Number],
      default: ""
    }
  },
  data () {
    return {
      title: "选择特殊符号",
      open: false,
      tableList: ['≤', '≥', '＜', '＞', '≮', '≯', '≠', '±', '+', '－',
        '×', '÷', '∑', '～', '≈', '≡', '≌', '∽', '√', 'φ',
        '*', '℃', '%', '‰', '＃', '＆', '＠', '∪', '∩', '∈',
        '∵', '∴', '∷', '⊥', '∥', '∠', '⌒', '⊙', '∧', '∨',
        '∏', '∫', '∮', '∝', '∞', 'Ф', 'm³', 'cm³', 'm²', 'cm²',
        'Ⅰ', 'Ⅱ', 'Ⅲ', 'P·I', 'P·Ⅱ', 'P·O', 'P·S·A', 'P·P', 'P·F', 'P·C',
        '□', 'Ⅰ', 'Ⅱ', 'Ⅲ', '₀', '₁', '₂', '₃', '₄', '₅',
        '₆', '₇', '₈', '₉', 'º', '¹', '²', '³', '⁴', '⁵',
        '⁶', '⁷', '⁸', '⁹', '⁺', '⁻', '₊', '₋', 'Aᵃ', 'Bᵇ',
        'Cᶜ', 'λ₁', 'λ₂']
    }
  },
  created () {
  },
  mounted () {
  },
  methods: {
    init () {
      const focusInput = store.state.reportForms.focusInput;
      if (!focusInput) {
        this.$message.warning("请把鼠标放在输入特殊符号所在文本框！")
        return
      }
      this.open = true;
    },
    // 填充符号
    setCharacter (value) {
      Bus.$emit("setCharacter", value);
      this.open = false;
    },
  },
}
</script>
<style lang="scss" scoped>
ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  font-family: Microsoft Yahei;
  font-size: 16px;
  list-style: none;
  padding: 0px;
  text-align: center;
}

li {
  width: 70px;
  padding: 10px 10px;

  &:hover {
    cursor: pointer;
    background-color: #188fff62;
  }
}
</style>
